{% extends 'base_right.html' %}

{% block bodycontent %}
<div class="content">
    <form id="form" class="form-horizontal form-ajax" role="form" data-toggle="validator" method="POST" >{% csrf_token %}
        <input type="hidden" name="username" value="{{username}}"/>

        <div class="form-group">
                <label for="password" class="control-label col-xs-12 col-sm-2">新密码:</label>
                <div class="col-xs-12 col-sm-6">
                    <input type="password" class="form-control" id="password" name="row[password]" placeholder="登录密码,长度6-20" data-rule="密码:required;length(6~20)" />
                </div>
        </div>
        <div class="form-group">
                <label for="pwdAgain" class="control-label col-xs-12 col-sm-2">确认新密码:</label>
                <div class="col-xs-12 col-sm-6">
                    <input type="password" class="form-control" id="pwdAgain" name="row[pwdAgain]" placeholder="请再次填写密码" data-rule="确认密码:required;match(row[password]);" />
                </div>
        </div>

        <div class="form-group layer-footer">
                <label class="control-label col-xs-12 col-sm-2"></label>
                <div class="col-xs-12 col-sm-6">
                    <a href="javascript:;" class="btn btn-success btn-embossed" >确定</a> 
                    <button type="reset" class="btn btn-default btn-embossed">重置</button>
                </div>
            </div>
    </form>
</div>
{% endblock %}


{% block footer %}
<script>
        $('#form').validator({
            valid: function (ret) {
                var data = $("#form").serialize();
                apiAjax("/mail/makepassword", data)
            }
        })
            // 使用链接代替submit按钮（注意：这种情况下输入框里面的回车键不能触发submit事件）
            .on("click", "a.btn.btn-success.btn-embossed", function (e) {
                $(e.delegateTarget).trigger("validate");
            });
</script>
{% endblock %}